<!--
 * @Author: MrLee
 * @Date: 2024-08-24 10:19:44
 * @LastEditors: MrLee
 * @LastEditTime: 2024-09-03 06:15:18
 * @Description: 请填写简介
-->
<template>
  <custom-navbar title="教育经历" :auto-back="true" left-icon-color="#303133" />
  <up-gap height="30rpx" />
  <view class="bg-#f6f7f8 px-22rpx">
    <view v-for="(item, index) in eduList" :key="index" @click="addEduFuc(item)"
      class="job-item mb-32rpx flex items-center rounded-[20rpx] bg-#fff px-40rpx py-24rpx shadow-[0px_6px_16px_0px_rgba(191,191,191,0.26)]">
      <view class="relative mr-[20rpx]">
        <image class="h-72rpx w-72rpx rounded-[50%]" :src="item.headerUrl" />
      </view>
      <view class="flex flex-col justify-center">
        <view class="mb-14rpx flex items-center justify-between">
          <view class="text-left text-[32rpx] text-[#1d2129]">
            {{ item.name }}
          </view>
        </view>
        <view class="flex items-center text-left text-[26rpx] text-[#6e6d72]">
          <view v-for="(itemTab, indexTab) in item.tabs" :key="indexTab" class="flex items-center justify-center">
            <view>{{ itemTab.label }}</view>
            <view v-if="indexTab !== item.tabs.length - 1" class="mx-10rpx h-28rpx w-2rpx bg-#6e6d72" />
          </view>
        </view>
      </view>
      <view class="iconfont icon-youjiantou1 flex-1 text-right" />
    </view>
  </view>
  <view class="fixed bottom-0 h-178rpx w-[100%] bg-#fff shadow-[0px_0px_12px_0px_rgba(238,239,241,0.50)]">
    <view
      class="mx-auto my-0 mt-[24rpx] h-82rpx w-[90%] rounded-[42rpx] bg-#1f50f2 text-center text-[30rpx] text-white font-medium leading-[82rpx]"
      @click="addEduFuc('add')">
      添加
    </view>
  </view>
</template>

<script setup lang="ts">
  // import userCatch01 from '@/static/images/tab/user-header.png';
  import { userEduList } from '@/api/user';
  const userCatch01 = "https://yiliao.test03.qcw800.com/static/images/tab/user-header.png";
  const eduList = ref([]);

  const addEduFuc = (item) => {
    console.log('addEduFuc', item);
    if (item == 'add') {
      uni.navigateTo({
        url: '/pages/tab/home/more/addEdu',
      });
      return
    }
    uni.navigateTo({
      url: '/pages/tab/home/more/addEdu?id=' + item.id,
    });
  };

  async function getEduList() {
    eduList.value = []
    let result = await userEduList();
    console.log('更多-教育经历列表 res list:::', result);
    let arr = []
    for (let i = 0; i < result.length; i++) {
      const r = result[i]
      arr.push({
        id: r.id,
        name: r.school_name,
        headerUrl: r.school.avatar,
        tabs: [
          {
            label: r.time,
            ico: 'icon-a-zu121328_1',
          },
          {
            label: r.qualification,
            ico: 'icon-a-zu121326_1',
          },
          {
            label: r.majors_name,
            ico: 'icon-a-zu121327_1',
          },
          {
            label: r.status_overseas_study == 1 ? '留学' : '未留学',
            ico: 'icon-a-zu121327_1',
          },
        ],
      })
      // eduList.push({
      //   id: r.id,
      //   name: r.school_name,
      //   headerUrl: r.school.avatar,
      //   tabs: [
      //     {
      //       label: r.time,
      //       ico: 'icon-a-zu121328_1',
      //     },
      //     {
      //       label: r.qualification,
      //       ico: 'icon-a-zu121326_1',
      //     },
      //     {
      //       label: r.majors_name,
      //       ico: 'icon-a-zu121327_1',
      //     },
      //     {
      //       label: r.status_overseas_study == 1 ? '留学' : '未留学',
      //       ico: 'icon-a-zu121327_1',
      //     },
      //   ],
      // });
    }
    eduList.value = arr
    console.log('eduList:::', eduList.value)
  }

  onLoad(() => {
    getEduList();
  });
  onShow(() => {
    getEduList();
  })
</script>
